﻿<!DOCTYPE html>
<html style="font-size: 100px;">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>注册</title>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="css/ydui.css?v=1.1.4" rel="stylesheet" />
    <link href="css/all.css?v=20180302" rel="stylesheet" />
    <script src="js/ydui.flexible.js"></script>
    <style type="text/css">
        .m-cell:after {border-bottom: none;}
        .m-cell .cell-item .cell-left{width:120px;}
        #l-map{height:6rem;width:100%;}
		#r-result{width:100%;}
        .anchorBL img {display: none;}

    </style>
    
</head>
<body style="background: #FFFFFF;" ms-controller="enrollview" class="ms-controller">
    <section class="g-flexview">

        <header class="m-navbar">
            <a onclick="history.go(-1)" class="navbar-item">
                <i class="iconfont icon-back"></i>
            </a>
            <div class="navbar-center">
                <span class="navbar-title">注册</span>
            </div>
        </header>

        <section class="g-scrollview">
            <div class="m-cell">
                <p style="font-size: .3rem;color:#ff8a00;padding:0.2rem 0.2rem 0rem 0.2rem;background-color:#fff;">
                    社区好生活入驻说明
                </p>
                <p style="font-size: .25rem;padding:0.1rem 0.2rem;background-color:#fff;">
                    <i class="iconfont icon-xuanzhong"></i>
                    1.请填写真实有效的个人和校区信息。
                </p>
                <p style="font-size: .25rem;padding:0.1rem 0.2rem;background-color:#fff;">
                    <i class="iconfont icon-xuanzhong"></i>
                    2.审核成功后，社区代理需要在两周内完成全社区宣传，否则就追回代理资格。
                </p>
                <p style="font-size: .3rem;color:#ff8a00;padding:0.2rem 0.2rem 0rem 0.2rem;background-color:#fff;">
                    选择社区位置
                </p>
            </div>
                
                <p id="mapDiv" style="width:100%;height:200px;">

                </p>
                <div id="r-result">
                    <div class="adresslist-content clearfix" ms-for="el in @PIOS">
                        <p class="adress-ico iconfont icon-dibiao"></p>
                        <div class="content-text">
                            <p class="title">{{el.name }}</p>
                            <p class="content">{{el.address }}</p>
                        </div>
                        <a href="" class="sure-btn">确认选点</a>
                    </div>
                </div>

                <div style="display:none;">


                    <div class="m-cell">

                        <div class="cell-item">
                            <div class="cell-left">申请人姓名：</div>
                            <div class="cell-right"><input type="text" class="cell-input" placeholder="请输入姓名" /></div>
                        </div>
                        <div class="cell-item">
                            <div class="cell-left">申请人手机号：</div>
                            <div class="cell-right"><input type="text" class="cell-input" placeholder="请输入手机号" /></div>
                        </div>
                        <div class="cell-item">
                            <div class="cell-left">社区名称：</div>
                            <div class="cell-right"><input type="text" class="cell-input" placeholder="请输入社区名称" /></div>
                        </div>
                        <div class="cell-item">
                            <div class="cell-left">社区地址：</div>
                            <div class="cell-right"><input type="text" class="cell-input" placeholder="请输入社区地址" /></div>
                        </div>
                        <div class="clearfix"></div>

                    </div>
                    <div class="m-celltitle">社区图片<span style="float:right;">1-3张</span></div>
                    <div class="m-cell m-cell-img">
                        <div class="m-uploader">
                            <ul>
                                <li>
                                    <img src="http://img1.shikee.com/try/2016/06/19/09430120929215230041.jpg_220x220.jpg" />
                                    <span class="delete" ms-on-tap="@DelFile(el)">×</span>
                                </li>
                                <li>
                                    <span class="add">+</span>
                                    <input type="file" class="upload-input" onchange="upload(this)" accept="image/jpeg,image/jpg,image/png">
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="m-celltitle">申请说明</div>
                    <div class="m-cell">
                        <div class="cell-item">
                            <div class="cell-right">
                                <textarea class="cell-textarea" placeholder="请输入申请说明"></textarea>
                            </div>
                        </div>
                    </div>
                    <p>
                        <a class="btn  btn-primary" style="width:95%;margin:0.2rem;">申请入驻</a>
                    </p>
                </div>
</section>
           



        </section>

    <script type="text/javascript" src='http://webapi.amap.com/maps?v=1.4.0&key=46184efa1abd5d6a926feadfbdf5014d'></script>
    <script src="//webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
    <script src="https://cdn.bootcss.com/jquery/2.2.0/jquery.min.js"></script>
    <script src="js/ydui.js"></script>
    <script src="js/avalon.mobile.min.js"></script>
    <script src="js/ComFunJS.js?v=20180331"></script>
    <script>

        var model = avalon.define({
            $id: "enrollview",
            PIOS: []

        })

        AMapUI.loadUI(['misc/PositionPicker'], function (PositionPicker) {
            var mapObj = new AMap.Map('mapDiv', {
                zoom: 15
            });
            var positionPicker = new PositionPicker({
                mode: 'dragMap',//设定为拖拽地图模式，可选'dragMap'、'dragMarker'，默认为'dragMap'
                map: mapObj//依赖地图对象
            });
            //TODO:事件绑定、结果处理等

            mapObj.plugin('AMap.Geolocation', function () {
                var geolocation = new AMap.Geolocation({
                    enableHighAccuracy: true,//是否使用高精度定位，默认:true
                    timeout: 10000,          //超过10秒后停止定位，默认：无穷大
                    maximumAge: 0,           //定位结果缓存0毫秒，默认：0
                    convert: true,           //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
                    showButton: true,        //显示定位按钮，默认：true
                    buttonPosition: 'LB',    //定位按钮停靠位置，默认：'LB'，左下角
                    buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
                    showMarker: true,        //定位成功后在定位到的位置显示点标记，默认：true
                    showCircle: true,        //定位成功后用圆圈表示定位精度范围，默认：true
                    panToLocation: true,     //定位成功后将定位到的位置作为地图中心点，默认：true
                    zoomToAccuracy: true      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
                });
                mapObj.addControl(geolocation);
                geolocation.getCurrentPosition();
                AMap.event.addListener(geolocation, 'complete', function (GeolocationResult) {
                    if (GeolocationResult.info == "SUCCESS") {
                        positionPicker.start();
                    }

                });//返回定位信息
                AMap.event.addListener(geolocation, 'error', function (GeolocationError) {


                });      //返回定位出错信息

            });
          
            positionPicker.on('success', function (positionResult) {
                model.PIOS = positionResult.regeocode.pois;
            })
        });
        //function onComplete(GeolocationResult) {
        //    if (GeolocationResult.info == "SUCCESS") {
        //        //alert(GeolocationResult.position)
        //    }
        //}
        //function onError(GeolocationError) {
        //    //alert(GeolocationError.message)
        //}
        //AMapUI.loadUI(['misc/PositionPicker'], function (PositionPicker) {
        //    var map = new AMap.Map('mapDiv', {
        //        mapStyle: 'amap://styles/normal',//样式URL
        //        resizeEnable: true,
        //        zoom: 16,
        //        scrollWheel: false
        //    });
        //    var positionPicker = new PositionPicker({
        //        mode: 'dragMap',
        //        map: map
        //    });

        //    //map.plugin('AMap.Geolocation', function () {
        //    //    geolocation = new AMap.Geolocation({
        //    //        enableHighAccuracy: true,//是否使用高精度定位，默认:true
        //    //        timeout: 10000,          //超过10秒后停止定位，默认：无穷大
        //    //        maximumAge: 0,           //定位结果缓存0毫秒，默认：0
        //    //        convert: true,           //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
        //    //        showButton: true,        //显示定位按钮，默认：true
        //    //        buttonPosition: 'LB',    //定位按钮停靠位置，默认：'LB'，左下角
        //    //        buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
        //    //        showMarker: true,        //定位成功后在定位到的位置显示点标记，默认：true
        //    //        showCircle: true,        //定位成功后用圆圈表示定位精度范围，默认：true
        //    //        panToLocation: true,     //定位成功后将定位到的位置作为地图中心点，默认：true
        //    //        zoomToAccuracy: true      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
        //    //    });
        //    //    map.addControl(geolocation);
        //    //    geolocation.getCurrentPosition();
        //    //    AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
        //    //    AMap.event.addListener(geolocation, 'error', onError);      //返回定位出错信息
        //    //});

        //    //var onComplete = function (GeolocationResult) {
        //    //    alert(0);
        //    //    positionPicker.start(GeolocationResult.position);
        //    //}
        //    //var onError = function (GeolocationError) {
        //    //    alert(1);
        //    //    positionPicker.start();
        //    //}

        //    positionPicker.on('success', function (positionResult) {
        //        //alert(JSON.stringify(positionResult.regeocode.pois));
        //    });
        //    positionPicker.on('fail', function (positionResult) {

        //    });

        //    positionPicker.start();
        //    map.panBy(0, 1);
        //    map.addControl(new AMap.ToolBar({
        //        liteStyle: true
        //    }))

        //});
        
      
     
     
    </script>
</body>
</html>
